<!DOCTYPE html><html lang="zh-Hans"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"><meta name="description" content="APP开发接口数据模拟"><meta name="keywords" content="工具"><meta name="author" content="kyren"><meta name="copyright" content="kyren"><title>APP开发接口数据模拟 | Kyren's Blog</title><link rel="shortcut icon" href="/melody-favicon.ico"><link rel="stylesheet" href="/css/index.css?version=1.9.0"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/font-awesome@latest/css/font-awesome.min.css?version=1.9.0"><meta name="format-detection" content="telephone=no"><meta http-equiv="x-dns-prefetch-control" content="on"><link rel="dns-prefetch" href="https://cdn.jsdelivr.net"><link rel="dns-prefetch" href="https://hm.baidu.com"><script>var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?cf87fcdbd9ab7cf93d894f7c219ae78f";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();</script><meta http-equiv="Cache-Control" content="no-transform"><meta http-equiv="Cache-Control" content="no-siteapp"><script src="https://v1.hitokoto.cn/?encode=js&amp;charset=utf-8&amp;select=.footer_custom_text" defer></script><script>var GLOBAL_CONFIG = { 
  root: '/',
  algolia: undefined,
  localSearch: {"path":"search.xml","languages":{"hits_empty":"找不到您查询的内容:${query}"}},
  copy: {
    success: '复制成功',
    error: '复制错误',
    noSupport: '浏览器不支持'
  },
  hexoVersion: '6.2.0'
} </script><meta name="generator" content="Hexo 6.2.0"></head><body><i class="fa fa-arrow-right" id="toggle-sidebar" aria-hidden="true"></i><div id="sidebar" data-display="true"><div class="toggle-sidebar-info text-center"><span data-toggle="切换文章详情">切换站点概览</span><hr></div><div class="sidebar-toc"><div class="sidebar-toc__title">目录</div><div class="sidebar-toc__progress"><span class="progress-notice">你已经读了</span><span class="progress-num">0</span><span class="progress-percentage">%</span><div class="sidebar-toc__progress-bar"></div></div><div class="sidebar-toc__content"><ol class="toc"><li class="toc-item toc-level-3"><a class="toc-link" href="#%E4%B8%80%E3%80%81%E6%A8%A1%E6%8B%9F%E6%9C%8D%E5%8A%A1%E5%99%A8%E8%A7%A3%E5%86%B3%E6%96%B9%E6%A1%88"><span class="toc-number">1.</span> <span class="toc-text">一、模拟服务器解决方案</span></a><ol class="toc-child"><li class="toc-item toc-level-4"><a class="toc-link" href="#1%EF%BC%89-%E4%BD%BF%E7%94%A8Apache%E5%BC%80%E5%90%AF-Web-Server"><span class="toc-number">1.1.</span> <span class="toc-text">1）.使用Apache开启 Web Server</span></a></li><li class="toc-item toc-level-4"><a class="toc-link" href="#2%EF%BC%89-%E4%BD%BF%E7%94%A8Python%E5%BC%80%E5%90%AF-Web-Server"><span class="toc-number">1.2.</span> <span class="toc-text">2）.使用Python开启 Web Server</span></a></li><li class="toc-item toc-level-4"><a class="toc-link" href="#3%EF%BC%89%E4%BD%BF%E7%94%A8Node-js-%E6%A8%A1%E6%8B%9F%E6%9C%8D%E5%8A%A1%E5%99%A8"><span class="toc-number">1.3.</span> <span class="toc-text">3）使用Node.js 模拟服务器</span></a><ol class="toc-child"><li class="toc-item toc-level-5"><a class="toc-link" href="#3-1-json-server"><span class="toc-number">1.3.1.</span> <span class="toc-text">3.1 json-server</span></a></li><li class="toc-item toc-level-5"><a class="toc-link" href="#3-2-ohana"><span class="toc-number">1.3.2.</span> <span class="toc-text">3.2 ohana</span></a></li></ol></li></ol></li><li class="toc-item toc-level-3"><a class="toc-link" href="#%E4%BA%8C%E3%80%81%E6%A8%A1%E6%8B%9F%E6%95%B0%E6%8D%AE%E7%94%9F%E6%88%90"><span class="toc-number">2.</span> <span class="toc-text">二、模拟数据生成</span></a><ol class="toc-child"><li class="toc-item toc-level-5"><a class="toc-link" href="#1-%E5%B8%B8%E7%94%A8node-js%E6%95%B0%E6%8D%AE%E6%A8%A1%E6%8B%9F%E5%BA%93"><span class="toc-number">2.0.1.</span> <span class="toc-text">1.常用node.js数据模拟库</span></a></li><li class="toc-item toc-level-5"><a class="toc-link" href="#2-%E7%94%9F%E6%88%90%E6%A8%A1%E6%8B%9F-JSON-%E5%9C%A8%E7%BA%BF%E5%B7%A5%E5%85%B7"><span class="toc-number">2.0.2.</span> <span class="toc-text">2.生成模拟 JSON 在线工具:</span></a></li><li class="toc-item toc-level-5"><a class="toc-link" href="#3-JSON-API-%E5%9C%A8%E7%BA%BF%E6%A8%A1%E6%8B%9F%E5%B7%A5%E5%85%B7"><span class="toc-number">2.0.3.</span> <span class="toc-text">3.JSON API 在线模拟工具:</span></a></li><li class="toc-item toc-level-5"><a class="toc-link" href="#%E4%BB%A3%E7%90%86%E6%9C%8D%E5%8A%A1%E5%99%A8"><span class="toc-number">2.0.4.</span> <span class="toc-text">代理服务器</span></a></li></ol></li></ol></li><li class="toc-item toc-level-3"><a class="toc-link" href="#Related-Posts"><span class="toc-number">3.</span> <span class="toc-text">Related Posts:</span></a></li></ol></div></div><div class="author-info hide"><div class="author-info__avatar text-center"><img src="https://avatars.githubusercontent.com/u/5827823?v=4"></div><div class="author-info__name text-center">kyren</div><div class="author-info__description text-center">huluo的技术博客</div><div class="follow-button"><a target="_blank" rel="noopener" href="https://github.com/huluo666">Follow Me</a></div><hr><div class="author-info-articles"><a class="author-info-articles__archives article-meta" href="/archives"><span class="pull-left">文章</span><span class="pull-right">239</span></a><a class="author-info-articles__tags article-meta" href="/tags"><span class="pull-left">标签</span><span class="pull-right">41</span></a><a class="author-info-articles__categories article-meta" href="/categories"><span class="pull-left">分类</span><span class="pull-right">29</span></a></div><hr><div class="author-info-links"><div class="author-info-links__title text-center">Links</div><a class="author-info-links__name text-center" target="_blank" rel="noopener" href="http://192.168.2.212:9090/">Jira</a><a class="author-info-links__name text-center" target="_blank" rel="noopener" href="http://192.168.2.212:8090/">Confluence</a><a class="author-info-links__name text-center" target="_blank" rel="noopener" href="http://bloc.leniugame.com/">Leniu</a></div></div></div><div id="content-outer"><div class="no-bg" id="top-container"><div id="page-header"><span class="pull-left"> <a id="site-name" href="/">Kyren's Blog</a></span><i class="fa fa-bars toggle-menu pull-right" aria-hidden="true"></i><span class="pull-right menus">   <a class="site-page" href="/">主页</a><a class="site-page" href="/essay">随笔</a><a class="site-page" href="/archives">归档</a><a class="site-page" href="/tags">标签</a><a class="site-page" href="/categories">分类</a><a class="site-page" href="/about">关于</a></span><span class="pull-right"><a class="site-page social-icon search"><i class="fa fa-search"></i><span> 搜索</span></a></span></div><div id="post-info"><div id="post-title">APP开发接口数据模拟</div><div id="post-meta"><time class="post-meta__date"><i class="fa fa-calendar" aria-hidden="true"></i> 2016-12-18</time><span class="post-meta__separator">|</span><i class="fa fa-inbox post-meta__icon" aria-hidden="true"></i><a class="post-meta__categories" href="/categories/%E5%B7%A5%E5%85%B7/">工具</a></div></div></div><div class="layout" id="content-inner"><article id="post"><div class="article-container" id="post-content"><p>测试API的模拟主要分以下2块</p>
<ul>
<li><strong>1.模拟服务器</strong> </li>
<li><strong>2.模拟测试数据</strong></li>
</ul>
<h3 id="一、模拟服务器解决方案"><a href="#一、模拟服务器解决方案" class="headerlink" title="一、模拟服务器解决方案"></a>一、模拟服务器解决方案</h3><h4 id="1）-使用Apache开启-Web-Server"><a href="#1）-使用Apache开启-Web-Server" class="headerlink" title="1）.使用Apache开启 Web Server"></a>1）.使用<code>Apache</code>开启 <code>Web Server</code></h4><p>Mac自己集成了<code>Python</code>和<code>Apache</code></p>
<p>启动：<code>sudo apachectl start</code></p>
<figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">停止：sudo apachectl stop</span><br><span class="line">重启：sudo apachectl restart</span><br><span class="line">查看 Apache 版本： httpd -v</span><br></pre></td></tr></table></figure>

<p>浏览器打开 <a target="_blank" rel="noopener" href="http://127.0.0.1/">http://127.0.0.1</a> 可以看到 <strong>It works!</strong> 的页面.</p>
<ol>
<li>使用本地回环测试地址<a target="_blank" rel="noopener" href="http://127.0.0.1/">http://127.0.0.1</a></li>
<li>使用<a target="_blank" rel="noopener" href="http://locahost/">http://locahost</a></li>
</ol>
<p>mac下Apache的默认文件夹为<code>/Library/WebServer/Documents</code></p>
<p>在该目录添加一个名为test.json文件</p>
<p>浏览器输入<a target="_blank" rel="noopener" href="http://127.0.0.1/test">http://127.0.0.1/test</a> 即可看到test.json文件内容</p>
<p><strong>修改Apache目录</strong></p>
<p>以上说的有点杂，折腾很久还是出现<code>Forbidden You don&#39;t have permission to access / on this server.</code></p>
<p>　上面说到了mac下Apache的默认文件夹为<code>/Library/WebServer/Documents</code>，该目录默认是隐藏的，操作不是很方便，我们可以将其修改成自定义的目录。</p>
<ul>
<li><strong>1.1</strong>、打开终端，输入命令：<code>sudo vim /etc/apache2/httpd.conf</code></li>
</ul>
<p>也可以找到<code>httpd.conf</code>文件进行编辑</p>
<figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="meta prompt_">$ </span><span class="language-bash"><span class="built_in">cd</span> /etc/apache2   <span class="comment">#进入文件夹</span></span></span><br><span class="line"><span class="meta prompt_">$ </span><span class="language-bash">open .		    <span class="comment">#打开文件夹</span></span></span><br></pre></td></tr></table></figure>

<ul>
<li><strong>1.2</strong>、找到如下两处</li>
</ul>
<p>　　<code>DocumentRoot &quot;/Library/WebServer/Documents&quot;</code><br>　　<code>&lt;Directory &quot;/Library/WebServer/Documents&quot;&gt;</code></p>
<ul>
<li><strong>1.3</strong>、将两处中引号中的目录替换为自定义的目录，如”<code>/Library/apacheWeb</code>“</li>
</ul>
<p>完成以上三步后，重启Apache，浏览器输入<a target="_blank" rel="noopener" href="http://127.0.0.1/">http://127.0.0.1</a></p>
<p><code>Forbidden You don&#39;t have permission to access / on this server.</code></p>
<p>这个折腾了好久，修改权限<code>sudo chmod -R 777 apacheWeb</code>也不行，灵机一动把<code>/Library/WebServer/Documents</code>目录中的<code>index.html.en</code>文件拷贝到自定义的目录，<code>sudo  apachectl restart</code> 后就可以看到 <strong>It works!</strong> 的页面！</p>
<p>访问某一文件如：<a target="_blank" rel="noopener" href="http://127.0.0.1/db">http://127.0.0.1/db</a></p>
<p><strong>其它修改方式参考</strong></p>
<p><a target="_blank" rel="noopener" href="http://www.saitjr.com/php/php-mac-yosemite-locahost-path.html">Mac 下修改 PHP 本地服务器路径</a></p>
<p><a target="_blank" rel="noopener" href="http://www.jianshu.com/p/baa1102490eb">mac 升级后配置 apache 到个人目录</a></p>
<h4 id="2）-使用Python开启-Web-Server"><a href="#2）-使用Python开启-Web-Server" class="headerlink" title="2）.使用Python开启 Web Server"></a>2）.使用Python开启 <code>Web Server</code></h4><p>相比Apache更简单不需要改本地服务器路径，随便进入一个目录即可开启</p>
<figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="meta prompt_">$ </span><span class="language-bash">python -m SimpleHTTPServer 		 <span class="comment">#默认8000端口</span></span></span><br><span class="line"><span class="meta prompt_">$ </span><span class="language-bash">python -m SimpleHTTPServer 8080    <span class="comment">#指定端口为8080</span></span></span><br></pre></td></tr></table></figure>

<p><code>python</code>会以当前目录作为根目录起一个本地server, 访问<code>localhost:8000</code>就可以看到效果了。</p>
<h4 id="3）使用Node-js-模拟服务器"><a href="#3）使用Node-js-模拟服务器" class="headerlink" title="3）使用Node.js 模拟服务器"></a>3）使用Node.js 模拟服务器</h4><h5 id="3-1-json-server"><a href="#3-1-json-server" class="headerlink" title="3.1 json-server"></a><strong>3.1</strong> <a target="_blank" rel="noopener" href="https://github.com/typicode/json-server">json-server</a></h5><p>3.1.1、全局<code>json-server</code>安装</p>
<figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><span class="meta prompt_">$ </span><span class="language-bash">sudo npm install json-server -g</span></span><br></pre></td></tr></table></figure>

<p>安装完成后可以用 <code>json-server -h</code> 命令检查是否安装成功，成功后会出现帮助命令选项。</p>
<p>3.1.2.启动server</p>
<figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="meta prompt_">$ </span><span class="language-bash"><span class="built_in">cd</span>  ~/Desktop/mock 				<span class="comment">#进入db.js文件目录</span></span></span><br><span class="line"><span class="meta prompt_">$ </span><span class="language-bash">json-server --watch db.json	    <span class="comment">#启动监听服务,当然也可以监听js,json，text，md等文本文件</span></span></span><br></pre></td></tr></table></figure>

<p>如果成功会出现:</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">\&#123;^_^&#125;/ hi!</span><br><span class="line">&#123;xxx: &#x27;xxx&#x27;&#125;</span><br><span class="line"> Home</span><br><span class="line"> http://localhost:3000</span><br></pre></td></tr></table></figure>

<p><code>json-server</code>启动默认端口为3000；</p>
<p>这个时候访问 <a target="_blank" rel="noopener" href="http://localhost:3000/db%E5%8F%AF%E4%BB%A5%E6%9F%A5%E7%9C%8B%E6%89%80%E5%AE%9A%E4%B9%89%E7%9A%84%E5%85%A8%E9%83%A8%E6%95%B0%E6%8D%AE%E3%80%82">http://localhost:3000/db可以查看所定义的全部数据。</a></p>
<p>更多：<a target="_blank" rel="noopener" href="http://fnpyud.com/2016/06/%E5%89%8D%E5%90%8E%E7%AB%AF%E5%88%86%E7%A6%BB%E4%B8%8B%E7%9A%84%E6%8E%A5%E5%8F%A3%E6%95%B0%E6%8D%AE%E6%A8%A1%E6%8B%9F/">前后端分离下的接口数据模拟</a></p>
<p>3.2 <strong>使用http-server搭建静态服务器</strong></p>
<p>1.安装http-server</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">npm install http-server -g</span><br></pre></td></tr></table></figure>

<p>2.启动</p>
<figure class="highlight shell"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">http-server -a 127.0.0.1				#默认端口8080</span><br><span class="line">http-server -a 127.0.0.1 -p 9999		#指定端口9999</span><br></pre></td></tr></table></figure>

<p>更多：<a target="_blank" rel="noopener" href="https://www.npmjs.com/package/http-server">https://www.npmjs.com/package/http-server</a></p>
<h5 id="3-2-ohana"><a href="#3-2-ohana" class="headerlink" title="3.2 ohana"></a>3.2 <a target="_blank" rel="noopener" href="https://github.com/Allenice/ohana">ohana</a></h5><p><code>ohana</code> 是一个返回模拟 json 数据的 node http 服务器，默认集成了 mockjs 生成动态的 json 数据，支持 POST, GET, PUT, DELETE 四种请求。</p>
<p><strong>特点：</strong></p>
<ul>
<li><p>使用 mockjs 生成 json 数据</p>
</li>
<li><p>支持路由规则</p>
</li>
<li><p>可跨域访问</p>
<p>如何使用：</p>
<p>作者主页<a target="_blank" rel="noopener" href="http://blog.allenice233.com/2014/12/01/ohana-node-server/">http://blog.allenice233.com/2014/12/01/ohana-node-server/</a></p>
</li>
</ul>
<p>常用web服务器框架</p>
<ul>
<li><a target="_blank" rel="noopener" href="http://expressjs.com/">express</a></li>
<li><a target="_blank" rel="noopener" href="http://hapijs.com/">hapi</a></li>
<li><a target="_blank" rel="noopener" href="http://koajs.com/">koa</a></li>
<li><a target="_blank" rel="noopener" href="http://restify.com/">restify</a></li>
</ul>
<p>开源项目：</p>
<ul>
<li><p><a target="_blank" rel="noopener" href="https://github.com/kliuj/local-ajax-api">local-ajax-api</a></p>
</li>
<li><p><a target="_blank" rel="noopener" href="https://github.com/hanan198501/imitator">imitator</a></p>
</li>
<li><p><a target="_blank" rel="noopener" href="https://www.npmjs.com/package/esky-mock">esky-mock</a></p>
</li>
<li><p><a target="_blank" rel="noopener" href="https://www.npmjs.com/package/aspserver">aspserver</a>  帮助快速搭建一个服务器，并自动拥有目录浏览等功能。</p>
</li>
<li><p><a target="_blank" rel="noopener" href="https://github.com/fieteam/fie-plugin-mock">fie-plugin-mock</a></p>
<p>以上是个人使用过的一些库，还有更多好用的库可以在<a target="_blank" rel="noopener" href="https://www.npmjs.com中搜索/">https://www.npmjs.com中搜索</a></p>
<p>​</p>
</li>
</ul>
<h3 id="二、模拟数据生成"><a href="#二、模拟数据生成" class="headerlink" title="二、模拟数据生成"></a>二、模拟数据生成</h3><h5 id="1-常用node-js数据模拟库"><a href="#1-常用node-js数据模拟库" class="headerlink" title="1.常用node.js数据模拟库"></a>1.常用node.js数据模拟库</h5><p><a target="_blank" rel="noopener" href="https://github.com/marak/Faker.js/">faker.js</a></p>
<p><a target="_blank" rel="noopener" href="http://mockjs.com/">mock.js</a></p>
<h5 id="2-生成模拟-JSON-在线工具"><a href="#2-生成模拟-JSON-在线工具" class="headerlink" title="2.生成模拟 JSON 在线工具:"></a>2.生成模拟 JSON 在线工具:</h5><ul>
<li><p><a target="_blank" rel="noopener" href="http://www.json-generator.com/">JSON Generator</a></p>
</li>
<li><p><a target="_blank" rel="noopener" href="https://www.mockaroo.com/">Mockaroo</a></p>
<p>​</p>
</li>
</ul>
<h5 id="3-JSON-API-在线模拟工具"><a href="#3-JSON-API-在线模拟工具" class="headerlink" title="3.JSON API 在线模拟工具:"></a>3.JSON API 在线模拟工具:</h5><ul>
<li><p><a target="_blank" rel="noopener" href="http://www.mocky.io/">Mocky</a></p>
</li>
<li><p><a target="_blank" rel="noopener" href="http://www.jsonohyeah.com/">jsonohyeah</a></p>
</li>
<li><p><a target="_blank" rel="noopener" href="http://jsonplaceholder.typicode.com/">JSONPlaceholder</a></p>
</li>
<li><p><a target="_blank" rel="noopener" href="https://www.mockable.io/">mockable.io</a></p>
</li>
<li><p><a target="_blank" rel="noopener" href="http://www.filltext.com/">FillText.com</a></p>
<p>​</p>
<p>商业化方案</p>
<ul>
<li><a target="_blank" rel="noopener" href="http://apizza.cc/?f=lv">http://apizza.cc/?f=lv</a></li>
<li><a target="_blank" rel="noopener" href="https://apiary.io/">https://apiary.io/</a></li>
<li><a target="_blank" rel="noopener" href="http://www.easyapi.com/">http://www.easyapi.com/</a></li>
<li><a target="_blank" rel="noopener" href="http://mock-api.com/">http://mock-api.com/</a></li>
<li><a target="_blank" rel="noopener" href="https://www.xgllseo.com/%20http://rap.taobao.org/org/index.do"> http://rap.taobao.org/org/index.do</a></li>
</ul>
</li>
</ul>
<h5 id="代理服务器"><a href="#代理服务器" class="headerlink" title="代理服务器"></a>代理服务器</h5><ul>
<li>使用 <a target="_blank" rel="noopener" href="http://www.charlesproxy.com/">charles</a>作为代理服务器</li>
<li>使用代理服务器的 map（映射）&amp; rewrite（重写）功能</li>
</ul>
<p><strong>示例代码：</strong></p>
<p><code>mock.js</code> 生成模拟数据，其它如json-server，koa，express等直接引用生成的数据就行</p>
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">// 使用 Mock 保存为mock_users.js</span></span><br><span class="line"><span class="keyword">var</span> <span class="title class_">Mock</span> = <span class="built_in">require</span>(<span class="string">&#x27;mockjs&#x27;</span>)</span><br><span class="line"><span class="keyword">let</span> <span class="title class_">Random</span> = <span class="title class_">Mock</span>.<span class="property">Random</span>;</span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">generateCustomers</span> () &#123;</span><br><span class="line">	<span class="keyword">var</span> total=<span class="number">10</span>;</span><br><span class="line">	<span class="keyword">var</span> customers = []</span><br><span class="line">	<span class="keyword">for</span> (<span class="keyword">var</span> id = <span class="number">0</span>; id &lt; total; id++) &#123;</span><br><span class="line">		<span class="keyword">var</span> firstName =<span class="title class_">Random</span>.<span class="title function_">cname</span>();</span><br><span class="line">		<span class="keyword">var</span> email =<span class="title class_">Random</span>.<span class="title function_">email</span>(<span class="string">&quot;pconline.com.cn&quot;</span>);</span><br><span class="line">		<span class="keyword">var</span> gender = <span class="title class_">Random</span>.<span class="title function_">pick</span>([<span class="string">&#x27;男&#x27;</span>, <span class="string">&#x27;女&#x27;</span>]);		</span><br><span class="line">		customers.<span class="title function_">push</span>(&#123;</span><br><span class="line">			<span class="string">&quot;id&quot;</span>: id,</span><br><span class="line">			<span class="string">&quot;first_name&quot;</span>: firstName,</span><br><span class="line">			<span class="string">&quot;Gender&quot;</span>: gender,</span><br><span class="line">			<span class="string">&#x27;email&#x27;</span>: email,</span><br><span class="line">		&#125;)</span><br><span class="line">	&#125;</span><br><span class="line">	<span class="keyword">var</span> data = <span class="title class_">Mock</span>.<span class="title function_">mock</span>(&#123; <span class="string">&quot;customers&quot;</span>: customers&#125;)</span><br><span class="line">	<span class="keyword">return</span> &#123;<span class="string">&quot;customers&quot;</span>: customers,</span><br><span class="line">			<span class="string">&quot;stateCode&quot;</span>:<span class="string">&quot;200&quot;</span>,</span><br><span class="line">			<span class="string">&quot;total&quot;</span>:<span class="string">&quot;85&quot;</span></span><br><span class="line">			&#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">var</span> jsonData = <span class="title class_">JSON</span>.<span class="title function_">stringify</span>(<span class="title function_">generateCustomers</span>());<span class="comment">//转换为json字符格式,在服务器端直接解析req.body  </span></span><br><span class="line"><span class="built_in">exports</span>.<span class="property">mockJson</span> = <span class="keyword">function</span> (<span class="params"></span>) &#123;</span><br><span class="line">	<span class="keyword">return</span> jsonData;</span><br><span class="line">&#125;;</span><br><span class="line"></span><br><span class="line"><span class="built_in">exports</span>.<span class="property">mockJson2</span> = <span class="keyword">function</span> (<span class="params"></span>) &#123;</span><br><span class="line">	<span class="keyword">return</span> <span class="title function_">generateCustomers</span>();</span><br><span class="line">&#125;;</span><br><span class="line"></span><br><span class="line"></span><br><span class="line"><span class="built_in">exports</span>.<span class="property">mockJsonTest</span> = <span class="keyword">function</span> (<span class="params"></span>) &#123;</span><br><span class="line">	<span class="keyword">return</span>  &#123;<span class="string">&quot;customers&quot;</span>:<span class="string">&quot;hello world&quot;</span>&#125;;</span><br><span class="line">&#125;;</span><br></pre></td></tr></table></figure>



<p>使用<code>json-server</code>模拟http server</p>
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//保存为 jsonserverMockAPI.js</span></span><br><span class="line"><span class="keyword">var</span> customUser = <span class="built_in">require</span>(<span class="string">&#x27;./mock_users2.js&#x27;</span>);<span class="comment">//引入模拟数据js文件</span></span><br><span class="line"><span class="comment">// 如果你要用json-server的话，就需要export这个生成fake data的function</span></span><br><span class="line"><span class="variable language_">module</span>.<span class="property">exports</span> = <span class="keyword">function</span>(<span class="params"></span>) &#123;</span><br><span class="line"><span class="comment">//	var jsonData = JSON.stringify(generateCustomers2());//转换为json字符格式,在服务器端直接解析req.body  </span></span><br><span class="line">	<span class="keyword">return</span> customUser.<span class="title function_">mockJson3</span>();</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>

<p>运行服务 <code>json-server --watch jsonserverMockAPI.js</code></p>
<p>使用<code>express</code>模拟http server</p>
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//保存为 expressMockAPI.js</span></span><br><span class="line"><span class="comment">// 引入 `express` 模块</span></span><br><span class="line"><span class="keyword">var</span> express = <span class="built_in">require</span>(<span class="string">&#x27;express&#x27;</span>);</span><br><span class="line"><span class="comment">// 调用 express 实例</span></span><br><span class="line"><span class="keyword">var</span> app = <span class="title function_">express</span>();</span><br><span class="line"><span class="keyword">var</span> customUser = <span class="built_in">require</span>(<span class="string">&#x27;./mock_users.js&#x27;</span>);<span class="comment">//引入模拟数据js文件</span></span><br><span class="line"><span class="comment">//console.log( &#x27;生成模拟数据\n&#x27; + customUser.mockJson());</span></span><br><span class="line"></span><br><span class="line"><span class="keyword">var</span> jsonData1 = customUser.<span class="title function_">mockJson</span>();<span class="comment">//转换为json字符格式,在服务器端直接解析req.body  </span></span><br><span class="line"><span class="comment">// app 本身有很多方法，其中包括最常用的 get、post、put/patch、delete，在这里我们调用其中的 get 方法，为我们的 `/` 路径指定一个 handler 函数。</span></span><br><span class="line"><span class="comment">// req和res是reques和response的缩写</span></span><br><span class="line"><span class="keyword">var</span> jsonData = customUser.<span class="title function_">mockJson2</span>();<span class="comment">//转换为json字符格式,在服务器端直接解析req.body  </span></span><br><span class="line"></span><br><span class="line"></span><br><span class="line">app.<span class="title function_">get</span>(<span class="string">&#x27;/&#x27;</span>, <span class="keyword">function</span> (<span class="params">req, res</span>) &#123;</span><br><span class="line">	res.<span class="title function_">contentType</span>(<span class="string">&#x27;json&#x27;</span>);<span class="comment">//返回的数据类型  </span></span><br><span class="line">		res.<span class="title function_">send</span>(jsonData);<span class="comment">//给客户端返回一个json格式的数据  </span></span><br><span class="line">		res.<span class="title function_">end</span>();  </span><br><span class="line">&#125;);</span><br><span class="line"> </span><br><span class="line"><span class="comment">// 监听本地的 3000 端口</span></span><br><span class="line">app.<span class="title function_">listen</span>(<span class="number">3000</span>, <span class="keyword">function</span> (<span class="params"></span>) &#123;</span><br><span class="line">	<span class="variable language_">console</span>.<span class="title function_">log</span>(<span class="string">&#x27;监听3000端口&#x27;</span>);</span><br><span class="line">&#125;);</span><br></pre></td></tr></table></figure>

<p>express服务器启动 <code>$ node expressMockAPI.js</code></p>
<p>使用<code>koa</code>模拟http server</p>
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//保存为如：KoaMockAPI001.js</span></span><br><span class="line"><span class="comment">//使用教程 https://cnodejs.org/topic/5709959abc564eaf3c6a48c8 </span></span><br><span class="line"><span class="keyword">var</span> customUser = <span class="built_in">require</span>(<span class="string">&#x27;./mock_users.js&#x27;</span>);<span class="comment">//引入模拟数据js文件</span></span><br><span class="line"><span class="variable language_">console</span>.<span class="title function_">log</span>( <span class="string">&#x27;生成模拟数据\n&#x27;</span> + customUser.<span class="title function_">mockJson</span>());</span><br><span class="line"></span><br><span class="line"><span class="keyword">var</span> <span class="title class_">Koa</span> = <span class="built_in">require</span>(<span class="string">&#x27;koa&#x27;</span>);</span><br><span class="line"><span class="keyword">var</span> app = <span class="keyword">new</span> <span class="title class_">Koa</span>();</span><br><span class="line"><span class="comment">// 此处开始堆叠各种中间件</span></span><br><span class="line"><span class="comment">//...</span></span><br><span class="line"></span><br><span class="line"><span class="comment">// response</span></span><br><span class="line">app.<span class="title function_">use</span>(<span class="function"><span class="params">ctx</span> =&gt;</span> &#123;</span><br><span class="line">	ctx.<span class="property">body</span> = customUser.<span class="title function_">mockJson</span>();</span><br><span class="line">&#125;);</span><br><span class="line"></span><br><span class="line">app.<span class="title function_">listen</span>(<span class="number">3000</span>);</span><br></pre></td></tr></table></figure>



<p>如何自动化</p>
<p>可以用如<code>nodemon</code> 去启动你的 express</p>
<p> <a target="_blank" rel="noopener" href="https://github.com/remy/nodemon">https://github.com/remy/nodemon</a></p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">nodemon app.js</span><br></pre></td></tr></table></figure>





<h3 id="Related-Posts"><a href="#Related-Posts" class="headerlink" title="Related Posts:"></a>Related Posts:</h3><ul>
<li><p><a target="_blank" rel="noopener" href="http://www.cnblogs.com/lewo/p/mock-json-server-install.html">用JSON-server模拟REST API(一) 安装运行系列</a></p>
</li>
<li><p><a target="_blank" rel="noopener" href="http://blog.allenice233.com/2014/12/01/ohana-node-server/">ohana - 一个返回模拟 json 数据的 node http server</a></p>
</li>
<li><p><a target="_blank" rel="noopener" href="https://cnodejs.org/topic/5021c2cff767cc9a51e684e3">forever让NodeJs应用后台执行</a></p>
</li>
<li><p><a target="_blank" rel="noopener" href="https://www.zhihu.com/question/23010264">网站后台要做客户端API接口，接口文档如何写?</a>  知乎</p>
<p>​</p>
</li>
</ul>
</div></article><div class="post-copyright"><div class="post-copyright__author"><span class="post-copyright-meta">文章作者: </span><span class="post-copyright-info"><a href="mailto:undefined">kyren</a></span></div><div class="post-copyright__type"><span class="post-copyright-meta">文章链接: </span><span class="post-copyright-info"><a href="http://huluo666.gitee.io/2016/12/18/APP开发接口数据模拟/">http://huluo666.gitee.io/2016/12/18/APP开发接口数据模拟/</a></span></div><div class="post-copyright__notice"><span class="post-copyright-meta">版权声明: </span><span class="post-copyright-info">本博客所有文章除特别声明外，均采用 <a target="_blank" rel="noopener" href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a> 许可协议。转载请注明来自 <a href="http://huluo666.gitee.io">Kyren's Blog</a>！</span></div></div><div class="post-meta__tag-list"><a class="post-meta__tags" href="/tags/%E5%B7%A5%E5%85%B7/">工具</a></div><nav id="pagination"><div class="prev-post pull-left"><a href="/2016/12/22/PingBox%20-Mac%E6%89%B9%E9%87%8Fping%E5%B7%A5%E5%85%B7/"><i class="fa fa-chevron-left">  </i><span>PingBox -Mac批量ping工具</span></a></div><div class="next-post pull-right"><a href="/2016/12/02/AutoLayout/"><span>AutoLayout 库</span><i class="fa fa-chevron-right"></i></a></div></nav></div></div><footer><div class="layout" id="footer"><div class="copyright">&copy;2022 By kyren</div><div class="framework-info"><span>驱动 - </span><a target="_blank" rel="noopener" href="http://hexo.io"><span>Hexo</span></a><span class="footer-separator">|</span><span>主题 - </span><a target="_blank" rel="noopener" href="https://github.com/Molunerfinn/hexo-theme-melody"><span>Melody</span></a></div><div class="footer_custom_text">hitokoto</div><div class="busuanzi"><script async src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script><span id="busuanzi_container_page_pv"><i class="fa fa-file"></i><span id="busuanzi_value_page_pv"></span><span></span></span></div></div></footer><i class="fa fa-arrow-up" id="go-up" aria-hidden="true"></i><script src="https://cdn.jsdelivr.net/npm/animejs@latest/lib/anime.min.js"></script><script src="https://cdn.jsdelivr.net/npm/jquery@latest/dist/jquery.min.js"></script><script src="https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@latest/dist/jquery.fancybox.min.js"></script><script src="https://cdn.jsdelivr.net/npm/velocity-animate@latest/velocity.min.js"></script><script src="https://cdn.jsdelivr.net/npm/velocity-ui-pack@latest/velocity.ui.min.js"></script><script src="/js/utils.js?version=1.9.0"></script><script src="/js/fancybox.js?version=1.9.0"></script><script src="/js/sidebar.js?version=1.9.0"></script><script src="/js/copy.js?version=1.9.0"></script><script src="/js/fireworks.js?version=1.9.0"></script><script src="/js/transition.js?version=1.9.0"></script><script src="/js/scroll.js?version=1.9.0"></script><script src="/js/head.js?version=1.9.0"></script><script src="/js/search/local-search.js"></script><script>if(/Android|webOS|iPhone|iPod|iPad|BlackBerry/i.test(navigator.userAgent)) {
  $('#nav').addClass('is-mobile')
  $('footer').addClass('is-mobile')
  $('#top-container').addClass('is-mobile')
}</script><div class="search-dialog" id="local-search"><div class="search-dialog__title" id="local-search-title">本地搜索</div><div id="local-input-panel"><div id="local-search-input"><div class="local-search-box"><input class="local-search-box--input" placeholder="搜索文章"></div></div></div><hr><div id="local-search-results"><div id="local-hits"></div><div id="local-stats"><div class="local-search-stats__hr" id="hr"><span>由</span> <a target="_blank" rel="noopener" href="https://github.com/wzpan/hexo-generator-search" style="color:#49B1F5;">hexo-generator-search</a>
 <span>提供支持</span></div></div></div><span class="search-close-button"><i class="fa fa-times"></i></span></div><div class="search-mask"></div></body></html>